<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>dojox.Grid with Dojo.Data via binding</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta> 
	<style type="text/css"> 
		@import "../../../../dojo/resources/dojo.css"; 
		@import "../../_grid/Grid.css"; 
		#grid { 
			width: 65em; 
			height: 25em; 
		}
	</style> 
	<script type="text/javascript" src="../../../../dojo/dojo.js"  
					djConfig="isDebug: true, debugAtAllCosts: false, parseOnLoad: true"></script> 
	<script type="text/javascript"> 
					dojo.require("dojox.grid.Grid"); 
					dojo.require("dojo.data.ItemFileWriteStore"); 
					dojo.require("dojo.parser"); 
					dojo.require("dijit.form.Button"); 
	</script> 
	<script type="text/javascript"> 
		function getRow(inRowIndex){ 
						return ' ' + inRowIndex; 
		}

		var layoutCountries = [ 
						// view 0 
						{ type: 'dojox.GridRowView', width: '20px' }, 
						// view 1 
						{ cells: [[{ name: "Row", get: getRow, width: 5}]], noscroll: true}, 
						// view 2 
						{ cells: [[ 
										{ name: "field 0", field: 0, width: 8 }, 
										{ name: "field 1", width: 8 } 
						]]} 
		];
		
		var emptyData = { identifier: 'name', label: 'name', items: []}; 
		var jsonStore = new dojo.data.ItemFileWriteStore({data: emptyData}); 
		var numItems = 0; 
	</script> 
</head> 
<body class="tundra"> 
				<h5>dojox.Grid using initially-empty Dojo.Data write stores and then adding an item.  Item should show up correctly (no "?"s) when added.</h5> 
		<br> 
				<span dojoType="dojox.grid.data.DojoData"  
								jsId="dataModel"  
								rowsPerPage="20" 
								store="jsonStore" count="0"> 
				</span> 
				<div id="grid" dojoType="dojox.Grid" elasticView="2"  
								model="dataModel" structure="layoutCountries"> 
				</div> 
				<button dojoType="dijit.form.Button"> 
								<script type="dojo/method" event="onClick"> 
												numItems++; 
												jsonStore.newItem({name: numItems + "-person Land", type: "city", population: numItems}); 
								</script> 
								Add Item 
				</button> 
</body> 
</html> 